<div class="toolbar">
  <div class="toolbar-header">
    <%= "ID: #{@staff.id} - #{@staff.full_name}" %>
  </div>
</div>

<ul class="nav nav-tabs">
  <li class="active"><a href="#staff_detail" data-toggle="tab"><%= t :general_info %></a></li>
  <li><a href="#user_account" data-toggle="tab"><%= t :setting_user_account %></a></li>
</ul>

<!-- Tab panes -->
<div class="tab-content">
  <div class="tab-pane active" id="staff_detail">
    <div class="row toolbar">
	  <div class="col-md-6">
		<span class="toolbar-header">
		  <%= t :general_info %>
		</span>
	  </div>
	  <div class="col-md-6 text-right">
		<ul class="toolbar-nav">
		  <li><% link_to feather_icon('circle-plus'), new_appointment_path %></li>
		  <li><%= link_to simple_icon('note'), edit_staff_path(@staff) %></li> 
          <li><%= link_to feather_icon('trash'), @staff, method: :delete, data: { confirm: 'Are you sure?' } %></li>
		</ul>
	  </div>
	</div>
	<table class="table table-striped">
      <tbody>
        <tr>
          <td style="width: 200px"><strong><%= t :name %></strong></td>
          <td><%= @staff.full_name %></td>
        </tr>
        <tr>
          <td><strong><%= t :role %></strong></td>
          <td><%= @staff.staff_role_id %></td>
        </tr>
        <tr>
          <td><strong><%= t :active %></strong></td>
          <td><%= @staff.active %></td>
        </tr>
        <tr>
          <td><strong><%= t :dob %></strong></td>
          <td><%= @staff.dob %></td>
        </tr>
        <tr>
          <td><strong><%= t :mobile %></strong></td>
          <td><%= @staff.mobile %></td>
        </tr>
        <tr>
          <td><strong>Email</strong></td>
          <td><%= @staff.email %></td>
        </tr>
      </tbody>
  </table>
  <div class="row toolbar">
	  <div class="col-md-6">
		<span class="toolbar-header">
		  <%= t :address %>
		</span>
	  </div>
	  <div class="col-md-6 text-right">
		<ul class="toolbar-nav">
		  <li><%= link_to feather_icon('circle-plus'), new_staff_contact_path(:staff_id => params[:id]) %></li>
		</ul>
	  </div>
  </div>
  <%= render @staff.contacts %>			
  </div>
  <div class="tab-pane" id="user_account">
  	<div class="row toolbar">
	  <div class="col-md-6">
		<span class="toolbar-header">
		  <%= t :setting_user_account %>
		</span>
	  </div>
	  <div class="col-md-6 text-right">
		<ul class="toolbar-nav">
		  <li><% link_to feather_icon('circle-plus'), new_appointment_path %></li>
		</ul>
	  </div>
	</div>
  </div>
</div>

